<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/common/taglib.jsp" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> 
<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>团队</title>
	<%@include file="/WEB-INF/common/static.jsp" %>
	<style>
		.checkbox-inline{
			width:70px;
			margin-left:0!important;
		}
		.Mycontent{
			float:right;
			text-align:right!important;
			padding-bottom:7px;
			border-radius:5px;
		}
		.Mytext{
			padding:7px 15px!important;
			border-radius:5px;
			text-align:left;
			font-weight:normal;
			background-color:rgba(19,185,44,.7);
		}
		.Mytimeget{
			float:left;
			font-weight:normal;
		}
		.Myname{
			float:right;
			color:#00CC99;
		}
		.Othername{
			text-align:left!important;
			color:#00CC99;
		}
		.Othertext{
			font-weight:normal;
			padding:7px 15px!important;
			border-radius:5px;
			background-color:rgba(221,214,225,.7);
		}
		.Othertimeget{
			float:right;
			text-align:left!important;
		}
		.Othercontent{
			border-radius:5px;
			padding-bottom:7px;
			float:left;
			text-align:left!important;
		}
		.Othercontent,.Othertimeget{
			font-weight:normal;
		}
		.hrefwords{
			margin-top:15px;
		}
		img{
			width:40px;
			height:40px;
		}
		#hrefwordContainer{
			border-top:1px solid #ccc;
		}
		.file{
			    border:1px solid #66afe9 !important;
			    position: relative;
			    display: inline-block;
			    border-radius: 4px;
			    padding: 6px 12px;
			    color:white;
			    background-color:#4cc0bf;
			    top:2px!important;
			    font-weight: normal!important;
			    text-decoration: none;
			    text-indent: 0;
			    line-height: 20px;
			}
			.file input{
			    position: absolute;
			    height :100%;
			    width: 100%;
			    right: 0;
			    top: 0;
			    opacity: 0;
			}
			.file:hover {
			    border-color: #78C3F3;
			    color: #004974;
			    text-decoration: none;
			}
	</style>
	<script type="text/javascript" src="${ctx }/ckeditor/ckeditor.js"></script>
	<script type="text/javascript">
		function updateInform(informId){
			if(informId == ''){
				alert("请选择要修改的通知");
				return;
			}
			$("#updateInform").load("${ctx}/officeManage/group/updateInform.do",{
				informId : informId
			},function(){
				$("#updateInform").modal("show");
			});
		}
		
		function saveUpdateInform(informId){
			if(informId == ''){
				alert("请选择要修改的通知");
				return;
			}
			var informContent = CKEDITOR.instances.informUpdateContent.document.getBody().getText();
			if(informContent == ''){
				alert("请输入通知内容");
				return;
			}
			$.post("${ctx}/officeManage/group/saveUpdateInform.do",{
				informId : informId,
				informContent : informContent
			},function(data){
				if(200 == data.code){
	        			alert(data.data);
	        			location.reload();
	        		}else{
	        			alert("添加失败！失败原因：" + data.data);
	        		}
       	 	},"json");
		}
		
		function deleteInform(informId){
			if(informId == ''){
				alert("请选择要删除的通知");
				return;
			}
			if(confirm("确定删除此条通知")){
				$.get("${ctx}/officeManage/group/deleteInform.do",{
					informId : informId
				},function(data){
		        		if(200 == data.code){
		        			alert(data.data);
		        			location.reload();
		        		}else{
		        			alert("添加失败！失败原因：" + data.data);
		        		}
		        	},"json");
			}
		}
		
		function saveInform(){
			var informContent = CKEDITOR.instances.informContent.document.getBody().getText();
			if(informContent == ''){
				alert("请输入通知内容");
				return;
			}
			$.post("${ctx}/officeManage/groupManage/saveInform.do",{
				groupId : $("#groupId").val(),
				informContent : informContent
			},function(data){
				if(200 == data.code){
	        			alert(data.data);
	        			location.reload();
	        		}else{
	        			alert("添加失败！失败原因：" + data.data);
	        		}
       	 	},"json");
		}
		
		function saveTask(){
			var taskName = $("#taskName").val();
			if(taskName == ''){
				alert("请输入任务名称");
				return;
			}
			var taskContent = $("#taskContent").val();
			var userIds = [];
			$("#addTask").find('input[name="username"]').each(function(){
           		if($(this).is(":checked")){
           			userIds.push($(this).val());
           		}
           	});
			if(userIds.length < 1){
				alert("请选择接受任务的人");
				return;
			}
			var endTime = $("#endTime").val();
			$.post("${ctx}/officeManage/taskManage/saveTask.do",{
					groupId : $("#groupId").val(),
					taskName : taskName,
					taskContent : taskContent,
					userIds : userIds,
					endTime : endTime
				},function(data){
					if(200 == data.code){
		        			alert(data.data);
		        			location.reload();
		        		}else{
		        			alert("添加失败！失败原因：" + data.data);
		        		}
	       	 	},"json");	
			}
		
		function getGroupFiles(){
			$("#groupFiles").load("${ctx}/officeManage/group/getGroupFiles.do",{
				groupId : $("#groupId").val()
			},function(){
				$("#groupFiles").modal("show");
			})
		}
		
		$(function(){
			var err = $("#uploadErr").val();
			if(err != ''){
				alert(err);
			}
		});
		
</script>
</head>
<body>
	<div id="groupFiles" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        
    </div>
    <!-- 以上modal为资源查看与上传 -->
    <div id="waitingcase" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color:white">x</button>
                    <span>待办任务列表</span>
                </div>
                <div class="modal-body">
	                <c:forEach var="task" items="${groupTasks }">
						<label style="padding:5px 20px;width:100%;font-weight:normal;" class="waitinglist_style">
							<span class="glyphicon glyphicon-list-alt"></span>
							<a href="javascript:void(0);">
								${task.name }
							</a>
						</label>
					</c:forEach>
            		</div>
            	<div class="modal-footer">
                	<button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">关闭</button>
            	</div>
            </div>
        </div>
    </div>
    <!-- 以上modal为待办任务列表查看 -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"  id="updateInform">
    		
    </div>
   	<!-- 以上为团队修改modal -->
    <div id="addInform" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color:white">x</button>
                    <span>添加团队通知</span>
                </div>
                <div class="modal-body">
					<div class="form-group">
						<label>通知内容：</label>
						<textarea name="informContent" htmlEscape="false" id="informContent" rows="10" cols="80">
			            </textarea>
			            <script>
			                CKEDITOR.replace( 'informContent' );
			            </script>
					</div>
            	</div>
            	<div class="modal-footer">
                	<button class="btn btn-primary" data-dismiss="modal" aria-hidden="true" onclick="saveInform();">添加</button>
            	</div>
            </div>
        </div>
    </div>
    <!-- 以上modal为添加团队通知功能 -->
 	<div id="addTask" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color:white">x</button>
                            <span>任务编写</span>
                        </div>
                        <div class="modal-body">
                        	<div class="form-group" style="padding:0 10px;margin-bottom:0!important;">
								<label for="publishVersion">任务名称：</label>
								<input type="text" class="form-control testName" placeholder="例如平台维护"  id="taskName">
                        	</div>
                        	<div class="form-group" style="padding:0 10px;margin-bottom:0!important;">
								<label class="control-label">指派人：</label>
								<br>
								<c:forEach var="user" items="${groupMembers }">
									<c:if test="${currentUser.id !=  user.id}">
										<label class="checkbox-inline">
							  				<input type="checkbox" name="username" value="${user.id }">${user.userName }
										</label>
									</c:if>
								</c:forEach>
                        	</div>
                        	<div class="form-group" style="padding:10px;margin-bottom:0!important;">
                        		<input  class="Wdate form-control" style="height:100%;"
  										type="text" id="endTime" onFocus="WdatePicker({isShowClear:false})"/>  	
                        	</div>
                        	<div class="form-group" style="padding:10px;margin-bottom:0!important;">
								<label>通知内容：</label>
								<textarea name="publishDescribe1" id="taskContent" rows="10" cols="80">
					                
					            </textarea>
					            <script>
					                CKEDITOR.replace( 'publishDescribe1' );
					            </script>
							</div>
                    	</div>
                    	<div class="modal-footer">
                        	<button class="btn btn-primary singleperson" aria-hidden="true" onclick="saveTask();">确定</button>
                    	</div>
                    </div>
                </div>
    </div>
   	<!-- 以上为指派任务使用modal -->
   	<div id="groupMembers" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color:white">x</button>
                    <span>查看团队成员</span>
                </div>
                <div class="modal-body">
                	<div class="form-group" id="members">
					<c:forEach var="groupMember" items="${groupMembers }" >
						<label class="checkbox-inline chooseperson">${groupMember.userName }</label>
					</c:forEach>
				</div>
            	</div>
            	<div class="modal-footer">
                	<button class="btn btn-primary updataNo" data-dismiss="modal" aria-hidden="true">确定</button>
            	</div>
            </div>
        </div>
	</div>
	<!-- 以上modal为团队成员查看功能 -->
	<ul class="nav nav-tabs" role="tablist">
   		<li role="presentation">
			<a href="${ctx }/officeManage/groupManange/showJoinGroups.do">所属团队</a>
		</li>
		<li role="presentation" class='active'>
			<a href="#" class="discussTitle">${group.name }</a>
			<input type="hidden" id="groupId" value="${group.id }"/>	
			<input type="hidden" id="uploadErr"	value="${uploadErr }"/>	
		</li>
	</ul>
	
	<!-- 团队通知 -->
	<div class="container">
		<div class="form-horizontal" style="border-bottom:1px solid #ccc;">
			<div class="form-group" style="margin-top:15px;padding-top:20px;background-color:rgba(221,214,225,.7);padding-bottom:15px;border-radius:5px;">
				<label class="col-sm-1 control-label" style="padding:7px 0;font-size: 18px;">团队通知</label>
				<div class="col-sm-11" style="padding-top:30px;" id="allInforms">
					<c:forEach var="groupInform" items="${groupInforms }">
							<div class="form-horizontal" >
								<div class="form-group hrefwords" style="font-weight:normal">
									<label class="col-sm-1 control-label" style="text-align:center;color:#4cc0bf">${groupInform.user.userName }:</label>
									<label class='control-label col-sm-6' style="text-align: left!important;font-weight:normal">
										${groupInform.inform.content }
									</label>
									<label class='control-label col-sm-3' style="text-align: left!important;font-weight:normal">
										<fmt:formatDate value="${groupInform.inform.createTime }" type="both"/>
									</label>
									<label class="control-label col-sm-2">
										<c:if test="${currentUser.id == groupInform.user.id}">
											<span class="glyphicon glyphicon-edit" style="float:left" onclick="updateInform(${groupInform.inform.id})"></span>
											<span class='glyphicon glyphicon-remove' style="float:left;margin-left:20px;" onclick="deleteInform(${groupInform.inform.id})"></span>
										</c:if>
									</label>
								</div>
							</div>
					</c:forEach>			
					
					<div class="form-horizontal" style="padding-top:10px;">
						<button type="button" class="btn btn-primary col-sm-offset-9"  onclick="showGroupMembers();"
							 		href="#groupMembers" data-toggle="modal" style="background-color:rgba(19,185,44,.7)!important;">成员列表</button>
						<button type="button" class="btn btn-primary" 
								 	href="#addInform" data-toggle="modal" style="background-color:rgba(19,185,44,.7)!important;">添加通知</button>
					</div>
					
				</div>
			</div>
        </div>
        <!-- 以上为团队通知区域 -->
        <div class="form-horizontal" style="border-bottom:1px solid #ccc;">
			<div class="form-group" style="padding-top:20px;">
				<label class="col-sm-1 control-label" style="padding:7px 0;font-size: 18px;">待办任务</label>
				<div class="col-sm-11">
					<div class="form-horizontal">
						<label class="control-label col-sm-offset-1 col-sm-7" style="text-align:left!important;color:grey;font-weight:normal;">
							最新指派任务：
												<c:forEach items="${groupTasks }" var="task" varStatus="stat"> 
													<c:if test="${stat.last}">${task.name }</c:if> 
												</c:forEach>
						</label>
						<button type="button" class="btn btn-primary col-sm-offset-2" href="#waitingcase" data-toggle="modal" style="background-color:rgba(19,185,44,.7)!important;">查看</button>
					</div>
				</div>
			</div>
        </div>
        <!-- 以上为待办任务区域 -->
        <div class="form-horizontal" style="border-bottom:1px solid #ccc;">
			<div class="form-group" style="padding-top:20px;">
				<label class="col-sm-1 control-label" style="padding:7px 0;font-size: 18px;">资源共享
				</label>
				<div class="col-sm-11">
					<div class="form-horizontal">
						<label class="control-label col-sm-offset-1 col-sm-7" style="text-align:left!important;color:grey;font-weight:normal;">
							最新上传文件：徐斌松-LI-PMC-项目周报-20170206-20170210.xlsx
						</label>
						<button type="button" class="btn btn-primary col-sm-offset-2" onclick="getGroupFiles();"
								 style="background-color:rgba(19,185,44,.7)!important;">查看</button>
					</div>
				</div>
			</div>
        </div>
        <!-- 以上为资源共享查看与上传区域 -->
        <div class="form-horizontal" style="">
			<div class="form-group" style="padding-top:20px;">
				<label class="col-sm-1 control-label" style="padding:7px 0;font-size: 18px;">任务指派</label>
				<div class="col-sm-11">
					<div class="form-horizontal">
						<button type="button" class="btn btn-primary col-sm-offset-10"  href="#addTask" data-toggle="modal"
									 style="background-color:rgba(19,185,44,.7)!important;">新增</button>
					</div>
				</div>
			</div>
        </div>
        <!-- 以上为任务指派区域(未完成) -->
	</div>
</body>
</html>